<template>
  <div class="yongjinzhichu">
    <div class="powertop">
      <router-link class="powertopli powertopact" to="/yongjintixian/yongjintixian" v-if="checkquanxian('V0301').length > 0">佣金提现</router-link>
      <router-link class="powertopli " to="/yongjintixian/tixianjilu" v-if="checkquanxian('V0302').length > 0">提现记录</router-link>
      <router-link class="powertopli " to="/yongjintixian/mingxi" v-if="checkquanxian('V0303').length > 0">佣金明细核对</router-link>
    </div>
    <div v-loading='loading' style="padding: 20px;">

     <div class="kflexc" style="margin-bottom: 30px;">
       <div><img src="../../../../static/yongjin/yongjin3.png" style="width: 22px; margin-bottom: 0;"></div>
       <div style="font-weight: bold; font-size: 18px; margin-left: 10px; position: relative; top: -2px;">可提现金额</div>
     </div>

     <div class="kflex">
       <div>
         <div class="kflexc" style="border-radius: 20px; padding: 28px 20px 29px; background:rgb(254, 244, 245);">
           <div style="font-size: 24px; color: rgb(254, 61, 61); border-radius: 10px; background: rgb(255, 231, 231); width: 40px; height: 40px;" class="kflexcc">￥</div>
           <div style="margin-left: 20px; font-weight: bold; font-size: 24px;">{{xiaojie.keti_sum || 0}}</div>
           <div style="margin-left: 80px; color: rgb(100, 100, 100);">已提现: {{xiaojie.yiti_sum}}</div>
         </div>
       </div>
     </div>

     <div class="kflexc" style="margin-bottom: 30px;  margin-top: 30px;">
       <div><img src="../../../../static/yongjin/yongjin3.png" style="width: 22px; margin-bottom: 0;"></div>
       <div style="font-weight: bold; font-size: 18px; margin-left: 10px; position: relative; top: -2px;">可提现账户</div>
     </div>

     <div class="kflex" style="">
       <div v-for="item in list3" :key="item.id" style="margin-bottom: 20px;">
         <div style="border-radius: 20px; margin-right: 50px; width: 280px; padding: 25px 20px; background:rgb(242, 248, 255);">
           <div class="kflexbc" style="">
             <div style="color: rgb(64, 66, 71); font-size: 16px;">{{item.type_name}}</div>
             <div class="kflexc">
               <div style="color: rgb(0, 90, 255); font-size: 14px; cursor: pointer; margin-right: 20px;" @click="xiugai(item)">修改</div>
               <div style="color: rgb(0, 90, 255); font-size: 14px; cursor: pointer;" @click="shanchu(item)">删除</div>
             </div>

           </div>
           <div style="margin-top: 10px; color: rgb(120, 125, 133); font-size: 14px;" v-if="item.no">{{item.no | jiami}}</div>
           <div style="margin-top: 10px; color: rgb(120, 125, 133); font-size: 14px;" v-if="!item.no">未设置</div>
         </div>
       </div>
       <!-- <div>
         <div style="border-radius: 20px; width: 280px; padding: 25px 20px; margin-left: 50px; background:rgb(242, 248, 255);">
           <div class="kflexbc" style="">
             <div style="color: rgb(64, 66, 71); font-size: 16px;">支付宝</div>
             <div style="color: rgb(0, 90, 255); font-size: 14px; cursor: pointer;" @click="xiugai(2)">修改</div>
           </div>
           <div style="margin-top: 10px; color: rgb(120, 125, 133); font-size: 14px;" v-if="all2.ali_idcard">{{all2.ali_idcard | jiami}}</div>
           <div style="margin-top: 10px; color: rgb(120, 125, 133); font-size: 14px;" v-if="!all2.ali_idcard">未设置</div>
         </div>
       </div> -->

       <div>
         <div @click="xiugai(3)" style="border-radius: 20px; width: 320px; height: 100px; box-sizing: border-box; padding: 25px 20px; cursor: pointer; border: 1px rgb(0, 90, 255) dashed; color: rgb(0, 90, 255);" class="kflexcc">
           + 添加提现账户
         </div>
       </div>
     </div>

     <div class="kflexc" style="margin-bottom: 30px; margin-top: 30px;">
       <div><img src="../../../../static/yongjin/yongjin4.png" style="width: 22px; margin-bottom: 0;"></div>
       <div style="font-weight: bold; font-size: 18px; margin-left: 10px; position: relative; top: -2px;">待提现佣金</div>
     </div>
     <div class="kflexc">
       <el-select clearable v-model="all.parent_name" style="width: 250px;" filterable placeholder="选择上游供应商">
         <el-option :label="item.name" :value="item.shop_id"  v-for="item in gongyingshanglists" :key="item.shop_id" ></el-option>
       </el-select>
       <el-button type="danger" round  style="margin-left: 20px;" @click="search()">检索</el-button>
     </div>

     <el-table :data="list" border style="width: 100%; margin: 20px 0;" ref="multipleTable" >

       <el-table-column align='center' prop='parent_name' label="供应商"></el-table-column>
       <el-table-column align='center' label="结算时间">
         <template slot-scope="scope">
           {{scope.row.confirm_expend_at}}
         </template>
       </el-table-column>
       <el-table-column align='center' prop='sum_commission' label="结算金额"></el-table-column>
       <el-table-column align='center' prop='' label="佣金调整金额（扣罚/奖励）">
         <template slot-scope="scope">
          <div v-if="scope.row.adjust_commission > 0" style="color: green;">{{scope.row.adjust_commission}}</div>
          <div v-if="scope.row.adjust_commission < 0" style="color: #f00;">{{scope.row.adjust_commission}}</div>
         </template>
       </el-table-column>
       <el-table-column align='center' prop='adjust_remark' label="调整原因"></el-table-column>
       <el-table-column align='center' prop='final_commission' label="到账金额"></el-table-column>
       <el-table-column align='center' prop='status' label="提现状态">
         <template slot-scope="scope">
           <div v-if="scope.row.status == 0">未结算</div>
           <div v-if="scope.row.status == 10">待结算</div>
           <div v-if="scope.row.status == 20">待打款</div>
           <div v-if="scope.row.status == 25" style="color: #f00;">
              已驳回
              <el-tooltip class="item" effect="dark" :content="scope.row.refuse_reason" placement="top-start">
                <i class="el-icon-warning" style="color: #f00; font-size: 22px;"></i>
              </el-tooltip>
           </div>
           <div v-if="scope.row.status == 30" style="color: green;">已打款</div>
           <div v-if="scope.row.status == 40" style="color: #f00;">
              打款失败
              <el-tooltip class="item" effect="dark" :content="scope.row.refuse_reason" placement="top-start">
                <i class="el-icon-warning" style="color: #f00; font-size: 22px;"></i>
              </el-tooltip>
           </div>
           <div v-if="scope.row.status == 50">打款中</div>
         </template>
       </el-table-column>
       <el-table-column align='center' label="操作" width="300px">
         <template slot-scope="scope">
           <div class="kflexc">
             <el-button type="text" v-if="scope.row.status == 10"  @click="shenqingtixian(scope.row)">申请提现</el-button>
             <el-button type="text" v-if="scope.row.status == 25" @click="shenqingtixian(scope.row)">再次申请</el-button>
             <el-button type="text"  @click="xiazai(scope.row)">下载订单明细</el-button>
           </div>

         </template>
       </el-table-column>
     </el-table>
     <el-pagination style="text-align: right;" background layout="total,prev, pager, next" :current-page="all.page" @current-change="fanye" :page-size="all.page_size" :total="total"></el-pagination>
    </div>

    <el-dialog title="绑定银行卡" :visible.sync="log1" width="450px"  :close-on-click-modal="false" :close-on-press-escape="false">

      <div style="margin-bottom: 40px;">
        <el-radio v-model="fixall2.type" :label="1">银行卡</el-radio>
        <el-radio v-model="fixall2.type" :label="10">支付宝</el-radio>
      </div>


      <div v-if="fixall2.type == 1">

        <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">银行卡号</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.no" placeholder="银行卡号"></el-input></div>
        <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">开户人</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.name" placeholder="开户人"></el-input></div>
        <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">开户银行</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.bank" placeholder="开户银行"></el-input></div>
        <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">开户人身份证号</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.idcard" placeholder="开户人身份证号"></el-input></div>
        <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">输入手机号</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.mobile" placeholder="输入手机号"></el-input></div>


        <!-- <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">开户支行</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.bank_sub" placeholder="开户支行"></el-input></div> -->


        <div class="kflexc" style="margin-bottom: 20px;">
          <el-checkbox v-model="fixall2.is_gm" :true-label="1" :false-label="0">同意灵活用工平台账户打款协议</el-checkbox>
        </div>
      </div>

      <div v-if="fixall2.type == 10">
        <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;"><span style="color: #f00;">*</span>支付宝账号</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.no" placeholder="支付宝账号"></el-input></div>
        <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;"><span style="color: #f00;">*</span>姓名</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.name" placeholder="姓名"></el-input></div>
        <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;"><span style="color: #f00;">*</span>身份证号</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.idcard" placeholder="身份证号"></el-input></div>
        <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;"><span style="color: #f00;">*</span>输入手机号</div>
        <div style="margin-bottom: 20px;"><el-input v-model="fixall2.mobile" placeholder="输入手机号"></el-input></div>

        <div class="kflexc" style="margin-bottom: 20px;">
          <el-checkbox v-model="fixall2.is_gm" :true-label="1" :false-label="0">同意灵活用工平台账户打款协议</el-checkbox>
        </div>
      </div>

      <span slot="footer" class="dialog-footer">
        <el-button @click="log1 = false">取消</el-button>
        <el-button type="danger" @click="shoukuango">确认</el-button>
      </span>
    </el-dialog>

    <el-dialog title="绑定支付宝" :visible.sync="log2" width="450px"  :close-on-click-modal="false" :close-on-press-escape="false">
      <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;"><span style="color: #f00;">*</span>支付宝账号</div>
      <div style="margin-bottom: 20px;"><el-input v-model="fixall2.ali_no" placeholder="支付宝账号"></el-input></div>
      <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;"><span style="color: #f00;">*</span>姓名</div>
      <div style="margin-bottom: 20px;"><el-input v-model="fixall2.ali_name" placeholder="姓名"></el-input></div>
      <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;"><span style="color: #f00;">*</span>身份证号</div>
      <div style="margin-bottom: 20px;"><el-input v-model="fixall2.ali_idcard" placeholder="身份证号"></el-input></div>
      <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;"><span style="color: #f00;">*</span>输入手机号</div>
      <div style="margin-bottom: 20px;"><el-input v-model="fixall2.ali_mobile" placeholder="输入手机号"></el-input></div>
      <div class="kflexc" style="margin-bottom: 20px;">
        <el-checkbox v-model="fixall2.is_gm" :true-label="1" :false-label="0">同意灵活用工平台账户打款协议</el-checkbox>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="log2 = false">取消</el-button>
        <el-button type="danger" @click="shoukuango">确认</el-button>
      </span>
    </el-dialog>

    <el-dialog title="工猫收款签约" :visible.sync="log" width="450px"  :close-on-click-modal="false" :close-on-press-escape="false">
      <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">输入手机号</div>
      <div style="margin-bottom: 20px;"><el-input v-model="all.yinhang" placeholder="输入手机号"></el-input></div>
      <div style="color: rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">验证码</div>
      <div style="margin-bottom: 20px;"><el-input v-model="all.yinhang" placeholder="验证码"></el-input></div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="log = false">取消</el-button>
        <el-button type="danger" @click="loggo">确认</el-button>
      </span>
    </el-dialog>



    <el-dialog title="申请提现" :visible.sync="log4" width="840px" :close-on-click-modal="false" :close-on-press-escape="false">
      <div>
        <div v-if="all3.refuse_reason" style="margin-bottom: 20px; color:rgb(254, 61, 61);">被驳回原因：{{all3.refuse_reason}}</div>
        <div class="kflexc">
          <!-- <div style="margin-right: 20px;">
            <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 20px;">收款方式</div>
            <div style=" margin-bottom: 20px;">
              <el-select filterable style="width: 200px; margin-right: 30px;" v-model="all3.collect_type" placeholder="请选择">
                <el-option  label="银行卡"  value="1" ></el-option>
                <el-option  label="支付宝"  value="2"></el-option>
              </el-select>
            </div>
          </div> -->
          <div style="margin-right: 20px;">
            <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 20px;">账户类型</div>
            <div style=" margin-bottom: 20px;">
              <el-select style="width: 235px; margin-right: 20px;" v-model="collect_typex" @change="collect_type = ''" placeholder="请选择">
                <el-option  label="银行卡"  value="1" ></el-option>
                <el-option  label="支付宝"  value="2"></el-option>
              </el-select>



            </div>
          </div>
          <div style="margin-right: 20px;" v-if="collect_typex == 1||collect_typex == 2">
            <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 20px;">选择账户</div>
            <div style=" margin-bottom: 20px;">
              <el-select filterable style="width: 235px; margin-right: 20px;" v-model="collect_type" @change="changezhanghu" placeholder="请选择账户/开户人" v-if="collect_typex == 1">
                <el-option :label="item.no + '/' + item.name" :value="item.id" v-for="item in list3" :key="item.id" v-if="item.type == 1"></el-option>
              </el-select>

              <el-select filterable style="width: 235px; margin-right: 20px;" v-model="collect_type" @change="changezhanghu" placeholder="请选择账户/开户人" v-if="collect_typex == 2">
                <el-option :label="item.no + '/' + item.name" :value="item.id" v-for="item in list3" :key="item.id" v-if="item.type == 10"></el-option>
              </el-select>

            </div>
          </div>
          <div >
            <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 20px;" class="kflexbc">
              <div>发票类型</div>
              <!-- <div style="font-size: 12px; color: #005AFF; margin-right: 30px; cursor: pointer;" @click="log7 = true">查看发票信息</div> -->
            </div>
            <div style=" margin-bottom: 20px;">
              <el-select filterable style="width: 235px; " v-model="all3.invoice_type" placeholder="请选择发票类型">
                <el-option  :label="item.name + toPercent(item.tax)"  :value="item.type" v-for="item in piaolist.data" :key="item.type" v-if="item.ok == 1 && item.tax != 0"></el-option>
                <el-option  :label="item.name"  :value="item.type" v-for="item in piaolist.data" :key="item.type" v-if="item.ok == 1 && item.tax == 0"></el-option>
              </el-select>
            </div>
          </div>
          <!-- <div style="margin-right: 20px;" v-if="all3.collect_type == 1 && collect_type != ''">
            <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 12px;">卡号</div>
            <div style=" margin-bottom: 20px;"><el-input v-model="all3.bank_no" disabled style="width: 200px;"></el-input></div>
          </div>
          <div  v-if="all3.collect_type == 1 && collect_type != ''">
            <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 12px;">开户行</div>
            <div style=" margin-bottom: 20px;"><el-input v-model="all3.bank" disabled style="width: 200px;"></el-input></div>
          </div>
          <div style="margin-right: 20px;" v-if="all3.collect_type == 2 && collect_type != ''">
            <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 12px;">支付宝号</div>
            <div style=" margin-bottom: 20px;"><el-input v-model="all3.ali_no" disabled style="width: 200px;"></el-input></div>
          </div>
          <div  v-if="all3.collect_type == 2 && collect_type != ''">
            <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 12px;">姓名</div>
            <div style=" margin-bottom: 20px;"><el-input v-model="all3.ali_name" disabled style="width: 200px;"></el-input></div>
          </div> -->
        </div>

        <!-- <div class="kflexc"> -->

<!--          <div style="margin-right: 20px;" v-if="all3.invoice_type != 5">
            <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 20px;" class="kflexbc">
              <div>发票介质</div>
              <div style="font-size: 12px; color: #005AFF; margin-right: 30px; cursor: pointer;" @click="log8 = true">查看邮寄地址</div>
            </div>
            <div style=" margin-bottom: 20px;">
              <el-select clearable filterable style="width: 200px; margin-right: 30px;" v-model="all3.invoice_way" placeholder="请选择发票介质">
                <el-option label="电子发票" :value="1"></el-option>
                <el-option label="纸质发票" :value="2"></el-option>
              </el-select>
            </div>
          </div> -->
        <!-- </div> -->

        <div style="background: rgb(252, 242, 242); padding: 20px; color: #000; border-radius: 10px; margin-bottom: 20px;" v-if="all3.invoice_type != 5 && all3.invoice_header">
          <div style="margin-bottom: 20px; font-size: 14px; color: rgb(98, 98, 98);">请按照下方信息开票</div>
          <div style="display: flex;">
            <div style="flex-grow: 1; flex-shrink: 1;" :class="[iszhan==2?'t_iszhan':'']">
              <div class="kflexc"  >
                <div style="width: 50%;" >发票抬头：{{all3.invoice_header}}</div>
                <div style="width: 50%;">纳税识别号：{{all3.invoice_code}}</div>
              </div>
              <div class="kflexc" style="margin-bottom: 20px;margin-top: 20px;">
                <div style="width: 50%;">开户行：{{all3.invoice_bank}}</div>
                <div style="width: 50%;">开户帐号：{{all3.invoice_bank_no}}</div>
              </div>
              <div class="kflexc">
                <div style="width: 50%;">联系电话：{{all3.invoice_tel}}</div>
                <div style="width: 50%;">开票地址：{{all3.invoice_addr}}</div>
              </div>
            </div>
            <div style="flex-grow: 0; flex-shrink: 0;align-self:end">
              <el-button v-if="iszhan==2" @click="iszhanfunc(1)" type="text">展开详情 <i class="el-icon-arrow-down"></i> </el-button>
              <el-button v-if="iszhan==1" @click="iszhanfunc(2)" type="text">收起详情 <i class="el-icon-arrow-up"></i></el-button>
            </div>
          </div>



        </div>

        <div style="width: 600px;" v-if="all3.invoice_way == 1 && all3.invoice_type != 5">
          <div style="color:rgb(64, 66, 71); font-size: 16px; margin-bottom: 20px;">上传发票<span style="margin-left: 20px; font-size: 12px;">提示:发票需为.pdf</span></div>

          <!-- <div ><chuantupdf :imgs="all3.invoice_img" @getimg="getimg" v-if="log4"></chuantupdf></div> -->
          <div ><chuantupdf :imgs="all3.invoice_imgs" @getimg="getimg" v-if="log4"></chuantupdf></div>
        </div>
        <div style="margin-top: 20px;" v-if="all3.invoice_way == 2">
          <div style="color:rgb(64, 66, 71); font-size: 16px; margin-bottom: 20px;">纸质发票邮寄单号</div>
          <div>
            <div>
              <div style="margin-right: 20px;">
                <!-- <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 20px;">输入物流公司</div> -->
                <div style=" margin-bottom: 20px;">
                  <el-select filterable style="width: 200px; margin-right: 30px;" v-model="all3.track_company" placeholder="请选择物流公司">
                    <el-option :label="item.company" :value="item.company" v-for="item in wuliu" :key="item.id"></el-option>
                  </el-select>
                </div>
              </div>
              <div style="margin-right: 20px;">
                <!-- <div style="color:rgb(64, 66, 71);font-size: 16px; margin-bottom: 20px;">输入物流单号</div> -->
                <div style=" margin-bottom: 20px;"><el-input v-model="all3.track_no" placeholder="输入物流单号" style="width: 200px;"></el-input></div>
              </div>
            </div>
          </div>
        </div>
        <div style="background: rgb(255, 245, 245);border-radius: 10px; padding: 20px; justify-content: space-around; margin-top: 20px;" class="kflexc" >
          <div style="text-align: center;">
            <div style="color:rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">提现金额</div>
            <div style="color:rgb(254, 61, 61); font-size: 16px; font-weight: bold;">￥{{qian.qian1}}</div>
          </div>
          <div style="text-align: center;">
            <div style="color:rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">增值税税额</div>
            <div style="color:rgb(254, 61, 61); font-size: 16px; font-weight: bold;">￥{{qian.qian2}}</div>
          </div>
          <div style="text-align: center;">
            <div style="color:rgb(64, 66, 71); font-size: 16px; margin-bottom: 10px;">实际到账金额</div>
            <div style="color:rgb(254, 61, 61); font-size: 16px; font-weight: bold;">￥{{qian.qian3}}</div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button round @click="log4 = false">关闭</el-button>
        <el-button type="primary" round @click="shenqingtixiango">提交申请</el-button>
      </span>
    </el-dialog>

    <el-dialog title="打款详情" :visible.sync="log5" width="820px" :close-on-click-modal="false" :close-on-press-escape="false">
      <div style="margin-bottom: 20px; color: rgb(64, 66, 71); font-size: 14px;">{{all4.withdraw_at}}，打款完成</div>
      <div style="margin-bottom: 20px; color: rgb(64, 66, 71); font-size: 14px;" v-if="all4.collect_type == 2">打款支付宝账户：{{all4.ali_no}}</div>
      <div style="margin-bottom: 20px; color: rgb(64, 66, 71); font-size: 14px;" v-if="all4.collect_type == 2">转账备注：{{all4.withdraw_remark}}</div>
      <div style="margin-bottom: 20px; color: rgb(64, 66, 71); font-size: 14px;" v-if="all4.collect_type == 1">打款截图</div>
      <div class="flexcc" v-if="all4.collect_type == 1">
        <img :src="all4.withdraw_pic">
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button round @click="log5 = false">关闭</el-button>
      </span>
    </el-dialog>

    <!-- <el-dialog title="查看发票" :visible.sync="log6" width="820px" :close-on-click-modal="false" :close-on-press-escape="false">
      <img :src="fapiaotu" style="width: 100%;">
      <span slot="footer" class="dialog-footer">
        <el-button round @click="log6 = false">关闭</el-button>
      </span>
    </el-dialog> -->

    <el-dialog title="发票信息" :visible.sync="log7" width="820px" :close-on-click-modal="false" :close-on-press-escape="false">

      <!-- <div>发票信息：</div> -->
      <div style="padding: 20px 50px;">
        <div class="kflex" style="margin-bottom: 20px; color: #999;"><div class="f1" style="color: #333;">发票抬头:</div>{{fapiaoxinxi.invoice_header}}</div>
        <div class="kflex" style="margin-bottom: 20px; color: #999;"><div class="f1" style="color: #333;">纳税人识别号:</div>{{fapiaoxinxi.invoice_code}}</div>
        <div class="kflex" style="margin-bottom: 20px; color: #999;"><div class="f1" style="color: #333;">开户行:</div>{{fapiaoxinxi.invoice_bank}}</div>
        <div class="kflex" style="margin-bottom: 20px; color: #999;"><div class="f1" style="color: #333;">开户行账号:</div>{{fapiaoxinxi.invoice_bank_no}}</div>
      </div>


      <span slot="footer" class="dialog-footer">
        <el-button round @click="log7 = false">关闭</el-button>
      </span>
    </el-dialog>

    <el-dialog title="邮寄地址" :visible.sync="log8" width="820px" :close-on-click-modal="false" :close-on-press-escape="false">
      <div>邮寄地址：
          省：{{fapiaoxinxi.addr_province}}
          市：{{fapiaoxinxi.addr_city}}
          区：{{fapiaoxinxi.addr_district}}
          地址：{{fapiaoxinxi.addr}}
          收货人：{{fapiaoxinxi.addr_name}}
          收货电话：{{fapiaoxinxi.addr_mobile}}
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button round @click="log8 = false">关闭</el-button>
      </span>
    </el-dialog>

    <el-dialog title="查看发票" :visible.sync="log9" width="820px" :close-on-click-modal="false" :close-on-press-escape="false">
      <div v-if="log9fapiao.invoice_way == 2" style="margin-bottom: 20px;">
        物流公司：{{log9fapiao.track_company}}
      </div>
      <div v-if="log9fapiao.invoice_way == 2">
        单号：{{log9fapiao.track_no}}
      </div>
      <div v-if="log9fapiao.invoice_way == 1">
        <a :href="log9fapiao.invoice_img" target="_blank" style="color: rgb(0, 90, 255);">{{log9fapiao.invoice_img}}</a>
      </div>
      <div v-if="log9fapiao.invoice_way == 1" class="flexcc" style="margin: 20px 0;"><el-button round plain type="primary" @click="down(log9fapiao.invoice_img)">下载</el-button></div>

      <span slot="footer" class="dialog-footer">
        <el-button round @click="log9 = false">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  import wuliu from '@/assets/wuliu.js'
  import axios from 'axios'
  import top from '@/components/top.vue'
  import left from '@/components/left.vue'
  import foot from '@/components/foot.vue'
  import moment from "moment";
  import XLSX from 'xlsx';
  import daizhichujilu from './jilu/daizhichujilu.vue'
  import yizhichujilu from './jilu/yizhichujilu.vue'
  import chuantupdf from './zujian/chuantupdfduo.vue'
  import _ from 'lodash';
  import {
      read,utils
    } from 'xlsx'

  export default {
    components: {
      "left": left,
      "top": top,
      "foot": foot,
      daizhichujilu,
      yizhichujilu,chuantupdf
    },
    name: "yongjinzhichu",
    data() {
      return {
        act:1,
        multipleSelection:[],
        times:[],
        loading:false,
        list2:"",
        all:{
          parent_name:"",
          // status:10,//状态0待结算10已结算20待打款30已打款
          status:'10,25',
          page:1,
          page_size:20
        },
        total:0,
        log:true,
        nowdateym:'',

        relo:true,

        log:false,
        log1:false,
        log2:false,
        log3:false,
        log4:false,
        log5:false,
        // log6:false,
        log7:false,
        log8:false,

        list:[],
        total:0,
        widthss:false,
        all2:{},
        fixall2:{
          id:"",
          type:1,
          no:"",
          name:"",
          idcard:"",
          mobile:"",
          bank:"",
          bank_sub:"",
          is_gm:""
        },
        money:0,
        all3:{
          collect_type:"1",
          invoice_type:5,
          invoice_way:1,
          ali_no:"",
          ali_name:"",
          bank_no:"",
          bank_name:"",
          bank:"",
          ali_idcard:"",
          ali_mobile:"",
          bank_idcard:"",
          bank_mobile:"",
          invoice_img:"",
          invoice_imgs:[],
          track_company:"",
          track_no:"",
          withdraw_amount:"",
          tax_amount:"",
          status:"",
          bank_sub:"",
          invoice_header:"",
          invoice_code:"",
          invoice_bank:"",
          invoice_bank_no:"",
          invoice_addr:'',
          invoice_tel:''
        },
        piaolist:"",
        qian:{
          qian1:0,
          qian2:0,
          qian3:0
        },
        all4:{},
        fapiaotu:"",
        wuliu:wuliu,
        fapiaoxinxi:"",
        log9fapiao:"",
        log9:false,
        yhknowchoose:false,
        zfbnowchoose:false,
        nowopentype:'',
        isshownow:false,
        isshowhave:false,
        user:'',
        qyurl:{},
        iscansign:'',
        bankinfo:{
          id:'',
          card_status:0
        },
        zfbinfo:{
          id:'',
          card_status:0
        },
        gongyingshanglists:"",
        xiaojie:"",

        list3:[],
        dangqianzhanghu:{},
        collect_type:"",

        collect_typex:"",
        iszhan:2
      }
    },

    filters:{
      jiami(val){
        if(val){
          let _len = val.length
          val = val.substring(0, 4) + '****' + val.substring(_len - 4, _len)
          return val
        }else{
          return val
        }
      }
    },
    created() {
      this.getlist()
      this.getshoukuan()
    },
    mounted() {

      //获取供应商
      axios.get('/api/gth/supplier/list?page_size=2000')
        .then(response => {
          if (response.data.msg.code == 0) {
            this.gongyingshanglists = response.data.data.data
          } else {
            this.$message.error(response.data.msg.info);
          }
        })

      axios.get('/api/plan-market/income/tixian/sum',{params:this.all})
        .then(response => {
          if (response.data.msg.code == 0) {
            this.xiaojie = response.data.data
          } else {
            this.$message.error(response.data.msg.info);
          }
        })
    },
    watch:{
      all3: {
        handler(newName, oldName) {
          if(this.piaolist.data && this.piaolist.data.length>0){
            this.piaolist.data.forEach(item=>{
              if(newName.invoice_type == item.type){
                if(this.ksradio==1){
                  this.qian = {
                    qian1:this.money,
                    qian2:(this.money / 1.06 * (0.06 - item.tax)).toFixed(2),
                    qian3:(this.money - (this.money / 1.06 * (0.06 - item.tax))).toFixed(2)
                  }
                }
                if(this.ksradio==2){
                  this.qian = {
                    qian1:this.money,
                    qian2:(this.money  * (0.06 - item.tax)).toFixed(2),
                    qian3:(this.money - (this.money  * (0.06 - item.tax))).toFixed(2)
                  }
                }

              }
            })
          }

        },
        immediate: true,
        deep:true
      }
    },

    methods: {
      changezhanghu:function(){

        this.list3.forEach(item=>{
          if(item.id == this.collect_type){
            this.dangqianzhanghu = item
          }
        })

        console.log(this.dangqianzhanghu)

        //1是银行卡 10是支付宝
        if(this.dangqianzhanghu.type == 1){
          this.all3.collect_type = 1
        }
        if(this.dangqianzhanghu.type == 10){
          this.all3.collect_type = 2
        }
        this.all3.ali_no = this.dangqianzhanghu.no
        this.all3.ali_name = this.dangqianzhanghu.name
        this.all3.bank_no = this.dangqianzhanghu.no
        this.all3.bank_name = this.dangqianzhanghu.name
        this.all3.bank = this.dangqianzhanghu.bank
        this.all3.ali_idcard = this.dangqianzhanghu.idcard
        this.all3.bank_idcard = this.dangqianzhanghu.idcard
        this.all3.bank_mobile = this.dangqianzhanghu.mobile
        this.all3.ali_mobile = this.dangqianzhanghu.mobile
        this.all3.bank_sub = this.dangqianzhanghu.mobile

      },
      //下载模板
      xiazai: function(item) {
        axios.post('/api/plan-market/expend/pool/exp2',{id:item.id})
        .then(response => {
          if (response.data.msg.code == 0) {
            location.href = location.origin + '/' + response.data.data
          } else {
            this.$message.error(response.data.msg.info);
          }
        })
      },
      shanchu:function(item){
        this.$confirm('确认删除此账户吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          axios.post('/api/plan-market/collection/del',{id:item.id})
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success('删除成功！');
              this.getshoukuan()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
        })
      },
      xiugai:function(item){
        if(!item){
          this.fixall2 = {
            "id": "",
            "type": 1,
            "no": "",
            "name": "",
            "idcard": "",
            "mobile": "",
            "bank": "",
            "bank_sub": "",
            is_gm:""
          }
          this.log1 = true
        }else{
          this.fixall2 = {
            "id": item.id,
            "type": item.type,
            "no": item.no,
            "name": item.name,
            "idcard": item.idcard,
            "mobile": item.mobile,
            "bank": item.bank,
            "bank_sub": item.bank_sub,
            is_gm:item.is_gm
          }
          this.log1 = true
        }
      },
      //小数转百分比
      toPercent(point,fixed){
        var percent = Number(point*100).toFixed(fixed);
        percent+="%";
        return percent;
      },
      getimg:function(url){
        this.all3.invoice_imgs = url
      },
      shenqingtixiango:function(){
        if(this.collect_type == ""){
          this.$message.error('请选择收款方式！');
          return false
        }
        if(this.all3.invoice_type != 5){
          if(!this.all3.invoice_way){
            this.$message.error('请选择发票类型！');
            return false
          }
          if(this.all3.invoice_way == 1){
            if(this.all3.invoice_imgs.length == 0){
              this.$message.error('请上传发票！');
              return false
            }
          }
          if(this.all3.invoice_way == 2){
            if(!this.all3.track_company){
              this.$message.error('请选择物流公司！');
              return false
            }
            if(!this.all3.track_no){
              this.$message.error('输入物流单号！');
              return false
            }
          }
        }

        axios.post('/api/plan-market/withdraw/take',this.all3)
        .then(response => {
          if (response.data.msg.code == 0) {
            this.$message.success('已提交申请！');
            this.getlist()
            this.log4 = false
          } else {
            this.$message.error(response.data.msg.info);
          }
        })
      },

      shenqingtixian:function(item){

        axios.get('/api/plan-market/invoice/parent/info?parent_id='+item.parent_id).then((response)=>{
        	if (response.data.msg.code == 0) {
            if(response.data.data != null){

              this.fapiaoxinxi = response.data.data

              this.piaolist = JSON.parse(response.data.data.configs)
              this.ksradio = this.piaolist.type

              this.money = item.final_commission

              // if(this.money == 0){
              //   this.$message.error('没有可提现金额');
              //   return false
              // }

              let invoice_type = 1
              let tax = 0
              if(this.piaolist.data.length > 0){

                let arr = this.piaolist.data.filter(item=>item.ok)

                invoice_type = arr[0].type
                tax = arr[0].tax
              }

              this.qian = {
                qian1:this.money,
                qian2:(this.money / 1.06 * (0.06 - tax)).toFixed(2),
                qian3:(this.money - (this.money / 1.06 * (0.06 - tax))).toFixed(2)
              }

              this.collect_typex = ""
              this.collect_type = ""
              this.all3 ={
                id:item.id,
                collect_type:"",
                invoice_type:invoice_type,
                invoice_way:1,

                ali_no:"",
                ali_name:"",
                bank_no:"",
                bank_name:"",
                bank:"",
                ali_idcard:"",
                bank_idcard:"",
                bank_mobile:"",
                ali_mobile:"",
                bank_sub:"",
                invoice_header:response.data.data.invoice_header,
                invoice_code:response.data.data.invoice_code,
                invoice_bank:response.data.data.invoice_bank,
                invoice_bank_no:response.data.data.invoice_bank_no,
                invoice_img:"",
                invoice_imgs:[],
                track_company:"",
                track_no:"",
                withdraw_amount:"",
                tax_amount:"",
                status:"",
                refuse_reason:item.refuse_reason,
                invoice_addr:response.data.data.invoice_addr,
                invoice_tel:response.data.data.invoice_tel
              }
              this.iszhan = 2
              this.log4 = true

              console.log('---')
              console.log(response.data.data)
            }else{
              this.$message.error('上游还未配置发票信息，无法提现请联系上游编辑发票信息')
            }
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })
      },
      shoukuango: _.debounce(function(row) {

        // if(this.log1){
        //   if(!this.fixall2.bank_no || !this.fixall2.bank_name || !this.fixall2.bank || !this.fixall2.bank_sub || !this.fixall2.bank_idcard || !this.fixall2.bank_mobile ){
        //     this.$message.error('请输入完整信息');
        //     return false
        //   }
        // }

        // if(this.log2){
        //   if(!this.fixall2.ali_no || !this.fixall2.ali_name || !this.fixall2.ali_idcard  ){
        //     this.$message.error('请输入完整信息');
        //     return false
        //   }
        // }

        axios.post('/api/plan-market/collection/make',this.fixall2)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.log1 = false
              // this.log2 = false
              this.getshoukuan()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      }, 1000),
      //统计
      getshoukuan:function(){
        axios.get('/api/plan-market/collection/info')
          .then(response => {
            if (response.data.msg.code == 0) {
              this.list3 = response.data.data

            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      search: function() {
        this.all.page = 1
        this.getlist()
      },
      //翻页
      fanye: function(page) {
        this.loading = true
        this.all.page = page
        this.getlist()
      },
      //获取列表
      getlist: function() {
        axios.get('/api/plan-market/income/pools',{params:this.all})
          .then(response => {
            if (response.data.msg.code == 0) {
              this.list = response.data.data.data
              if(this.list.length > 0){
                this.list.forEach(item=>{
                  item.daozhang = parseFloat(item.sum_commission) + parseFloat(item.adjust_commission)
                })
              }

              this.total = response.data.data.total
              this.loading = false
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },

      iszhanfunc(type){
        this.iszhan = type
      }

    }
  }
</script>

<style lang="scss" scoped>
  .yongjinzhichu {
    .lia{ padding: 10px 0; margin: 0 15px; border-bottom: 3px rgb(255, 255, 255) solid; cursor: pointer; color: rgb(51, 51, 51);}
    .acts{ border-bottom: 3px #2974FF solid;}
    .powertop {
    	display: flex;
    	background:#f9f9f9;
    }
    .powertopli {
    	flex-basis: 180px;
    	line-height: 50px;
    	border-bottom: 3px #F9F9F9 solid;
    	color: #727272;
    	border-right: 1px #F9F9F9 solid;
    	font-size: 16px;
    	text-align: center;
    }
    .router-link-active {
    	background: #FFFFFF;
    	border-bottom: 3px #2974FF solid;
    }
    /deep/ .el-pagination.is-background .btn-prev:disabled{ background: rgba(246, 246, 246, 0.3); border: 1px rgba(167, 167, 167, 0.3) solid;}
    /deep/ .el-pagination.is-background .btn-next:disabled{ background: rgba(246, 246, 246, 0.3); border: 1px rgba(167, 167, 167, 0.3) solid;}
    /deep/ .el-pagination.is-background .btn-next{ background: rgba(246, 246, 246,1); border: 1px rgba(167, 167, 167,1) solid;}
    /deep/ .el-pagination.is-background .btn-prev{ background: rgba(246, 246, 246,1); border: 1px rgba(167, 167, 167,1) solid;}
    /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{ background-color: #2974FF;}
    /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active:hover {
        color: #fff;
    }
    /deep/ .el-pagination.is-background .el-pager li:not(.disabled):hover {
        color: #2974FF;
    }
    /deep/ .el-pager li{ border-radius: 14px; background: rgba(255, 255, 255, 1); border: 1px rgba(167, 167, 167, 0.3) solid;}
    /deep/ .btn-prev{ border-radius: 14px; padding: 0 10px;}
    /deep/ .btn-next{ border-radius: 14px; padding: 0 10px;}

    /deep/ .el-table th{ background: rgb(246, 246, 246);}
    /deep/ .el-input__inner{ line-height: 36px; height: 36px; font-size: 12px; background: rgb(247, 248, 250);  border: 0;}
    /deep/ .el-date-editor .el-range-input{ background: rgb(247, 248, 250); }
    /deep/ .el-button{ padding: 11px 23px !important;}
    /deep/ .el-button--mini{ padding: 6px 15px !important;}
    /deep/ .el-button--danger {
        color: #FFF;
        background-color: #2974FF;
        border-color: #2974FF;
    }
    .team {
    	background: #F9F9F9;
    }
  }
</style>
<style  scoped>
.t_iszhan{
  height: 30px;
  overflow: hidden;
}
</style>
